<template>
  <div>
    <input type="text" v-model.number="num1">
    <input type="text" v-model.number="num2">
    <!-- 使用的时候 是属性或变量 -->
   {{ num3 }}
  </div>
</template>

<script>
export default {
  // 计算属性 ： 简化插值表达式
  // 缓存 (面试会问 这是优点)
  data() {
    return {
      num1: 10,
      num2: 20
    }
  },
  computed: {
    //  计算属性定义的是方法
    //  计算属性依赖的数据 发生变化 会重新计算
    num3() {
      console.log('num3计算总和')
      return this.num1 + this.num2
    }
  },
  methods: {}
}
</script>

<style scoped>
</style>
